<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>上机测试</title>
    <style>
        html,body {
            height: 100%;
            width:100%;
            margin: 0;
            padding: 0;
        }
        body {
            width: 800px;
            height: 100%;
            margin: auto;
            color: #56688a;
            font-family: "Microsoft YaHei";
            line-height: 28px;
        }
        .notice {
            color: red;
        }
        p{
            margin: 0;
            padding: 0;
        }

    </style>
</head>
<body>
    <p>上机测试题目，总计100分</p>
    <p class="notice">
        &nbsp;&nbsp;&nbsp;&nbsp;
        注意：在test1.js中实现第一题逻辑，在test2.html中实现第二题效果，在test3.html中实现第三题</p>
        <br/>
    <p>
        &nbsp;&nbsp;&nbsp;&nbsp;
        第一题（20分）：给定一个字符串，里边可能包含“()”、"{}"、“[]”三种括号，请使用JavaScript实现一个函数
        <br/>
        function testFn(str){...}， 检查该字符串的括号是否成对出现。
        <br/>
        例如：
        <br/>
        “(a[b(c)d]e{f}g)”    //true
        <br/>
        “(a[b(cd]e{f}g))”    //false
        <br/>
        “(a[b(c)d]e{f}”      //false
    </p>
    <br/> <br/>
    <p>
        &nbsp;&nbsp;&nbsp;&nbsp;
        第二题（40分）：请使用html + css 实现下图效果，要求还原度越接近越好，如果能够实现卡片根据容器宽度自适应调整个数，加10分
        <img src="/static/img/test2.png" style="width: 800px">
    </p>

    <br/> <br/>
    <p>
        &nbsp;&nbsp;&nbsp;&nbsp;
        第三题（40分）：场景应用题，在test3.html中完成前端剩余逻辑
        <a href="http://127.0.0.1:3000/test/test3.html" target="_blank">http://127.0.0.1:3000/test/test3.html</a>
    </p>




</body>
</html>